<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="../images/favicon.ico">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <title>李双意的个人网站--Li Shuang Yi's Personal Website</title>
    <link rel="stylesheet" href="../lib/bootstrap/css/bootstrap.css">
    <!--[if lt IE 9]>
    <script src="../lib/html5shiv/html5shiv.clockjs"></script>
    <script src="../lib/respond/respond.clockjs"></script>
    <![endif]-->
    <!--<link rel="stylesheet" href="../css/index.css">-->
    <!--<link rel="stylesheet" href="../css/common.css">-->
    <link rel="stylesheet" href="../lib/animatecss/animate.min.css">
    <link rel="stylesheet" href="../css/home.css">
    <link rel="stylesheet" href="../css/login_regsiter.css">
</head>

<body>
<div id="home" class="home">
    <!--person-->
    <div class="personality slide" id="personality">
        <div class="myself">
            <a href="javascript:;" class="log" id="loginer">登录</a>
            <div class="intrude-less">
                <header id="header" class="inner">
                    <a href="javascript:;" class="profilepic">
                        <img src="../images/home/psu.jpg" id="clockjs-avatar" title="逛一逛">
                    </a>

                    <hgroup>
                        <h2 class="header-author"><a href="#">李双意</a></h2>
                    </hgroup>

                    <p class="header-subtitle">一直在前端路上，从未停止过脚步。</p>

                    <form>
                        <input type="text" class="st-default-search-input search" id="search" placeholder=" Search...">
                    </form>


                    <div id="switch-area" class="switch-area">
                        <div class="switch-wrap">
                            <section class="switch-part switch-part1">
                                <nav class="header-menu">
                                    <ul>
                                        <li><a href="/">博客首页</a></li>

                                        <li><a href="/works">作品展示</a></li>

                                        <li><a href="/about">留言打卡</a></li>

                                        <li><a href="/FrontEndGuide">前端导航</a></li>
                                    </ul>
                                </nav>
                                <nav class="header-nav">
                                    <ul class="social">

                                        <a class="fl mail" target="_blank" href="#" title="mail">mail</a>

                                        <a class="fl github" target="_blank" href="#" title="github">github</a>

                                        <a class="fl zhihu" target="_blank" href="#" title="zhihu">zhihu</a>

                                        <a class="fl weibo" target="_blank" href="#" title="weibo">weibo</a>

                                        <a class="fl google" target="_blank" href="#" title="google">google</a>

                                        <a class="fl twitter" target="_blank" href="#" title="twitter">twitter</a>

                                        <a class="fl facebook" target="_blank" href="#" title="facebook">facebook</a>

                                        <a class="fl rss" target="_blank" href="#" title="rss">rss</a>

                                    </ul>
                                </nav>
                            </section>
                        </div>

                    </div>
                </header>
                <div id="animateController">
                    <button id="btn1">D</button>
                    <button id="btn2">U</button>
                    <button id="btn3">L</button>
                    <button id="btn4">R</button>
                    <button id="btn5">T</button>
                </div>
            </div>
        </div>
    </div>

    <!--homepage-->
    <div class="homepage" id="homepage">
        <div class="homeBack clearfix" id="homeBack">
            <!--导航栏-->
            <nav class="navbar navbar-homepage">
                <div class="container-fluid">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                                data-target="#bs-example-navbar-collapse-1">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                    </div>

                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                        <ul class="nav navbar-nav">
                            <li class="active"><a href="home.html">home</a></li>
                            <li><a href="#">归档</a></li>
                            <li><a href="#">标签</a></li>
                            <li><a href="#">分类</a></li>
                            <li><a href="note_book.html">笔记</a></li>
                        </ul>
                        <form class="navbar-form navbar-left hidden-sm" role="search">
                            <div class="form-group">
                                <input type="text" class="form-control" placeholder="JavaScript高级程序设计">
                            </div>
                            <button type="submit" class="btn btn-default">搜索</button>
                        </form>
                        <ul class="nav navbar-nav navbar-right">
                            <li><a href="#">关于</a></li>
                            <li><a href="message/message.html">留言</a></li>
                            <li><a href="javascript:;" id="wrap">注册</a></li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">更多<span class="caret"></span></a>
                                <ul class="dropdown-menu" role="menu">
                                    <li><a href="#">php</a></li>
                                    <li><a href="#">java</a></li>
                                    <li><a href="#">c</a></li>
                                    <li><a href="#">c++</a></li>
                                    <li class="divider"></li>
                                    <li><a href="#">继续了解</a></li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>
            </nav>

            <div class="homeBook" id="homeBook">
                <ul class="clearfix">
                    <li>
                        <a href="#">
                            <img src="../images/home/book-gc.jpg" alt=""/>
                            <p>Javascript高级程序</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../images/home/book-html5.css3.jpg" alt=""/>
                            <p>h5/c3权威指南</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../images/home/book-jsjingcui.jpg" alt="">
                            <p>Javascript语言精粹</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../images/home/book-ajax.jpg" alt="">
                            <p>ajax权威指南</p>
                        </a>
                    </li>

                </ul>
                <ul class="clearfix">
                    <li>
                        <a href="#">
                            <img src="../images/home/book-fljQuery.jpg" alt="">
                            <p>锋利的jQuery</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../images/home/book-oop.jpg" alt="">
                            <p>Javascript面向对象</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../images/home/book-nodejs.jpg" alt="">
                            <p>node js深入浅出</p>
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            <img src="../images/home/book-angularjs.jpg" alt="">
                            <p>Angular Js权威指南</p>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <canvas id="c"></canvas>
    </div>

    <!--login-->
    <div class="loginer" id="mustLogin">
        <span class="glyphicon glyphicon-remove right" id="loginDele"></span>
        <div id="loginDraw">
            <div class="photo" id="photo">
            </div>
            <span>会员登录</span>
        </div>
        <form action="" id="login-form">
            <div id="u" class="form-group">
                <input id="username"  class="form-control" name="username" type="text" size="18" alt="login" required="">
                <span class="logSuccee" id="logSuccee"></span>
                <span class="form-highlight"></span>
                <span class="form-bar"></span>
                <label for="username" class="float-label">手机号/邮箱</label>
                <div class="error-u">
                    邮箱不能为空
                </div>
            </div>
            <div id="p" class="form-group">
                <input id="password" class="form-control" spellcheck=false name="password" type="password" size="18" alt="login" required="">
                <span class="form-highlight"></span>
                <span class="form-bar"></span>
                <label for="password" class="float-label">密码</label>
                <div class="error-p">
                    密码不能为空
                </div>
            </div>
            <div class="form-group">
                <input type="checkbox" id="rem">
                <label for="rem">记住密码</label>
                <button id="submit" type="submit" name="button" value="button" ripple>登录</button>
            </div>
            <div class="form_reg_btn">
                <span>还没有帐号？</span><a href="javascript:;" id="nowWrap">马上注册</a>
            </div>
        </form>
        <div class="other_login">
            <div class="left other_left">
                <span>其它登录方式</span>
            </div>
            <div class="right other_right">
                <a href="#">QQ登录</a>
                <a href="#">微信登录</a>
                <a href="#">微博登录</a>
            </div>
        </div>
    </div>

    <!--regsiter-->
    <div class="wrap login_wrap" id="regsiter">
        <span class="glyphicon glyphicon-remove right" id="regsiterDele"></span>
        <div class="content">
            <div class="logo"></div>
            <div class="login_box">
                <div class="login_form">
                    <div class="login_title" id="login_title">
                        注册
                    </div>
                    <div id="ue">
                        <form action="" method="post">

                            <div class="form_text_ipt">
                                <input name="username" type="text" placeholder="手机号/邮箱" id="regMob">
                            </div>
                            <span class="regSuccee" id="regstyle"></span>
                            <div class="ececk_warning"><span>数据不能为空</span></div>
                            <div class="form_text_ipt">
                                <input name="password" type="password" id="psw1" placeholder="密码">
                            </div>
                            <div class="ececk_warning"><span>数据不能为空</span></div>
                            <div class="form_text_ipt">
                                <input name="repassword" type="password" id="psw2" placeholder="重复密码">
                            </div>
                            <span class="resetSuccee" id="resetstyle"></span>
                            <div class="ececk_warning"><span>数据不能为空</span></div>
                            <!--<div class="form_text_ipt">
                                <input name="code" type="text" placeholder="验证码">
                            </div>
                            <div class="ececk_warning"><span>数据不能为空</span></div>-->

                            <div class="form_btn">
                                <button type="button" name="button" value="button" id="regsitBtn">注册</button>
                            </div>
                            <div class="form_reg_btn">
                                <span>已有帐号？</span><a href="javascript:;" id="nowLogin">马上登录</a>
                            </div>
                        </form>
                    </div>

                    <div class="other_login">
                        <div class="left other_left">
                            <span>其它登录方式</span>
                        </div>
                        <div class="right other_right">
                            <a href="#">QQ登录</a>
                            <a href="#">微信登录</a>
                            <a href="#">微博登录</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>



    <div id="addButton"></div>
    <div id="randomWallpaper">
        <img id="fengche" src="../images/home/fengche.png" alt="换张壁纸">
        <div id="fengchegan"></div>
    </div>
    <!--<div id="floating"></div>-->

</div>



<script src="../lib/jquery/jquery.js"></script>
<script src="../lib/bootstrap/js/bootstrap.js"></script>
<script src="../js/canvas.js"></script>
<script src="../js/home.js"></script>
<script src="../js/login_regster.js"></script>
</body>
</html>